/*第五页************************************************************第五页css样式*/

.page-five {overflow: hidden; position: relative;}
.tap {
	position: absolute;
	top: 65%;
	left: 5%;
	width: 30%;
	opacity: 0;
	z-index: 50;
	/*animation: fadeIn 1s infinite;*/
}
.tamen{
	position: absolute;
	top: 5%;
	left: 15%;
	width: 30%;
	z-index: 50;
	opacity: 0;
	/*animation: fadeIn 2s both;*/
	
}
.page-five ul {
	position: relative;
	width: 100%;
	height: 100%;
	transform: scale(1.1) translateX(5%);
	background: url(../img/pagefive/bg.jpg);
}
.page-five li img {
	position: absolute;
	width: 100%;
	
}
.page-five li img:nth-child(1) {
	left: 0;
	top: 0;
	z-index: 10;
	/*animation: hangPage5 1s 2s both;*/
}
.page-five li img:nth-child(2) {
	width: 150%;
	left: -50%;
	top: -15%;
}
.page-five li img:nth-child(3) {
	width: 110%;
	left: -5%;
	top: -2%;
	z-index: 20;
	/*animation: hangPage5Dwon 2s 1s both;*/
}
.page-five li {
	width: 13%;
	height: 15%;
	position: absolute; 
	left: 100px;
	top: 100px;
	transform: rotateZ(15deg);
	/*overflow: hidden;*/
}
.page-five li:nth-child(1) {
	left: 8%;
	top: 24.5%;
}
.page-five li:nth-child(2) {
	left: 6.5%;
	top: 56%;
}
.page-five li:nth-child(3) {
	left: 28.5%;
	top: 38%;
}
.page-five li:nth-child(4) {
	left: 22.5%;
	top: 79.5%;
}
.page-five li:nth-child(5) {
	left: 50%;
	top: 20%;
}
.page-five li:nth-child(6) {
	left: 44%;
	top: 61.5%;
}
.page-five li:nth-child(7) {
	left: 53.5%;
	top: 41.8%;
}
.page-five li:nth-child(8) {
	left: 75%;
	top: 24%;
}
.page-five li:nth-child(9) {
	left: 74%;
	top: 55.5%;
}
.page-five li:nth-child(10) {
	left: 64%;
	top: 75%;
}
/*第五页 人物简介************************************第五页 人物简介************/
.personIntro {
	background: #1b1b1b;
	background-size: 100% 100%;
	width: 90%;
	height: 80%;
	color: white;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	z-index: 50;
	display: none;
	
}
.personIntro img:nth-child(1) {
	height: 8%;
	position: absolute;
	right: 0;
}
.personIntro img:nth-child(2) {
	position: absolute;
	width: 100%;
	left: 0;
	top: 8%;
}
.personIntro>h2 {
	font-size: 1.8rem;
	margin-top: 100%;
	text-align: left;
	padding-left: 2rem;
}
.personIntro>p {
	width: 80%;
	font-size: 1rem;
	text-align: left;
	padding-left: 2rem;
	line-height: 1.5rem;
	margin: 0;
}




/*动画帧*/
@keyframes hangPage5{
	from{}
	to{transform: scale(1.2) translate3d(-20%, -20%, 0);}
}
@keyframes hangPage5Dwon{
	from{}
	to{transform: translate3d(-15%, 300%, 0);opacity: 0;}
}
@keyframes hangPage5Show{
	from{transform: rotate(360deg) scale(0);}
	to{}
}
@keyframes hangPage5Hide{
	from{}
	to{transform: rotate(360deg) scale(0);}
}
